<template>
  <basic-container>
    <div class="school">
      <el-form>
        <el-row class="schoolTitleCss" style="padding-top: 4%">
          <span>{{ schoolName }}</span>
        </el-row>

        <el-row style="margin-left: 20px; margin-top: 2%">
          <el-col
            :span="14"
            style="margin-top: 8px; font-size: 20px; font-weight: bold"
            >整体概况</el-col
          >
          <!-- <el-col :span="4">
            <el-form-item label="年度">
              <el-select
                v-model="yearly"
                size="small"
                style="width: 100px"
                clearable
                class="m-left20"
              >
                <el-option
                  v-for="item in yearlyList"
                  :key="item.yearly"
                  :label="item.yearly"
                  :value="item.yearly"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item label="学期">
              <el-select
                class="m-left20"
                v-model="term"
                size="small"
                style="width: 180px"
                clearable
              >
                <el-option
                  v-for="item in semesterList"
                  :key="item.termId"
                  :label="item.term"
                  :value="item.termId"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col> -->
          <!-- <el-col :span="10">
            <el-form-item label="测评项目">
              <el-select
                v-model="projectId"
                placeholder="请选择项目"
                size="small"
                style="width: 250px"
                clearable
              >
                <el-option
                  v-for="item in projectOptions"
                  :key="item.projectId"
                  :label="item.projectName"
                  :value="item.projectId"
                >
                </el-option>
              </el-select>
              <el-button
                type="primary"
                size="small"
                @click="searchProjectData"
                style="margin-left: 10px"
              >
                搜索
              </el-button>
              <el-button type="primary" size="small" @click="handleDown({})">
                查看详情
              </el-button>
            </el-form-item>
          </el-col> -->
        </el-row>
        <el-row
          v-if="isLoad"
          class="borderCss"
          style="padding: 20px; margin-left: 10px; margin-right: 10px"
        >
          <el-row>
            <!-- <el-col
              :span="6"
              class="texAlignCenter"
              style="border-right: 2px solid"
            >
              <el-row>
                <span class="topTitleCss">学生总数</span>
              </el-row>
              <el-row>
                <span style="color: #3eea3e">
                  {{ schoolDataObj.totalTenantPostNumber.studentNum || 0 }}
                </span>
                人</el-row
              >
            </el-col> -->
            <el-col
              :span="6"
              class="texAlignCenter"
              style="border-right: 2px solid"
            >
              <el-row>
                <span class="topTitleCss">发布测评人数</span>
              </el-row>
              <el-row
                ><span style="cursor: pointer; color: #3eea3e">{{
                  schoolDataObj.findReleaseFinishTestNum.length
                    ? schoolDataObj.findReleaseFinishTestNum[0].num
                    : 0
                }}</span>
                人</el-row
              >
            </el-col>
            <el-col
              :span="6"
              class="texAlignCenter"
              style="border-right: 2px solid"
            >
              <el-row><span class="topTitleCss">已完成测评人数</span></el-row>
              <el-row
                ><span
                  style="cursor: pointer; color: #3eea3e"
                  @click="handleDown({})"
                  >{{
                    schoolDataObj.findFinishTestNum.length
                      ? schoolDataObj.findFinishTestNum[0].num
                      : 0
                  }}</span
                >
                人</el-row
              >
            </el-col>
            <el-col
              :span="6"
              class="texAlignCenter"
              style="border-right: 2px solid"
            >
              <el-row>
                <span class="topTitleCss">未完成测评人数</span>
              </el-row>
              <el-row
                ><span style="color: #3eea3e" @click="linkTo()">{{
                  schoolDataObj.findNoReleaseFinishTestNum.length
                    ? schoolDataObj.findNoReleaseFinishTestNum[0].num
                    : 0
                }}</span>
                人</el-row
              >
            </el-col>
            <!-- <el-col
              :span="4"
              class="texAlignCenter"
              style="border-right: 2px solid"
            >
              <el-row><span class="topTitleCss">未完成测评人数</span></el-row>
              <el-row
                ><span
                  style="cursor: pointer; color: #ffbb00"
                  @click="linkDealt()"
                  >{{
                    schoolDataObj.findFinishNoTestNum.length
                      ? schoolDataObj.findFinishNoTestNum[0].num
                      : 0
                  }}</span
                >
                人</el-row
              >
            </el-col> -->
            <el-col :span="6" class="texAlignCenter">
              <el-row><span class="topTitleCss">预警人数</span></el-row>
              <el-row
                ><span
                  style="cursor: pointer; color: red"
                  @click="handleDown({ level: '1,2,3,4' })"
                  >{{ schoolDataObj.findLevelAllNum[0].num }}</span
                >
                人</el-row
              >
            </el-col>
          </el-row>
        </el-row>
        <el-row v-if="isLoad" style="margin: 5px">
          <el-row>
            <el-col :span="8">
              <letBoard :schoolDataObj="schoolDataObj"></letBoard>
            </el-col>
            <el-col :span="16">
              <rightBorad :schoolDataObj="schoolDataObj"></rightBorad> </el-col
          ></el-row>
        </el-row>
      </el-form>
    </div>
  </basic-container>
</template>

<script>
import { mapGetters } from "vuex";
import {
  findALLNum,
  findALLTestNum,
  findAllGradeLevelInterveneNum,
  findFinishNoTestNum,
  findFinishTestNum,
  findGradeLevelInterveneNum,
  findReleaseFinishTestNum,
  findLevelAllNum,
  findLevelNum,
  findLevelSexNum,
  findAllGradeNoTestNum,
  findNoReleaseFinishTestNum,
  totalTenantPostNumber,
  getTenant,
} from "@/api/report/report";
import letBoard from "./letBoard";
import rightBorad from "./rightBorad";
import { getCensusList } from "@/api/census";
import { getTermListAll } from "@/api/system/semester";
import { uniqBy } from "lodash-es";
import { getList } from "@/api/system/dict";
export default {
  name: "thirdRegister",
  components: { letBoard, rightBorad },
  data() {
    return {
      isLoad: false,
      schoolName: "",
      tenantId: "",
      projectId: "",
      time: "",
      projectOptions: [],
      schoolDataObj: {},
      yearlyList: [],
      semesterList: [],
      yearly: "",
      half: "",
      term: "",
    };
  },
  computed: {
    ...mapGetters(["userInfo"]),
  },
  created() {},
  mounted() {
    this.getProjectInfo();
    getTermListAll(1, 1000, {}).then((result) => {
      var _this = this; //注意！一定要重新定义一下this指向
      let res18DataList = result.data.data;
      for (let zz = 0; zz < res18DataList.length; zz++) {
        let item = res18DataList[zz];
        _this.yearlyList.push(item);
        _this.semesterList.push(item);
        if (item.currentFlag == "Y") {
          _this.term = item.termId;
          _this.yearly = item.yearly;
        }
      }
      _this.yearlyList = uniqBy(_this.yearlyList, "yearly");
      _this.semesterList = uniqBy(_this.semesterList, "termId");
      this.initData();
    });
  },
  methods: {
    searchProjectData() {
      this.isLoad = false;
      this.initData();
    },
    initData() {
      let tenantId = JSON.parse(window.localStorage.getItem("saber-userInfo"))
        .content.tenantId;
      if (this.$route.query.tenantId) {
        tenantId = this.$route.query.tenantId;
      }
      var _this = this; //注意！一定要重新定义一下this指向
      let projectId = this.projectId;
      this.$axios
        .all([
          findALLNum({
            tenantId: tenantId,
            projectId: projectId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findALLTestNum({
            tenantId: tenantId,
            projectId: projectId,
            termId: _this.term,
            half: _this.half,
            yearly: _this.yearly,
          }),
          findAllGradeLevelInterveneNum({
            tenantId: tenantId,
            projectId: projectId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findFinishNoTestNum({
            tenantId: tenantId,
            projectId: projectId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findFinishTestNum({
            tenantId: tenantId,
            projectId: projectId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findGradeLevelInterveneNum({
            tenantId: tenantId,
            projectId: projectId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findReleaseFinishTestNum({
            tenantId: tenantId,
            projectId: projectId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findLevelAllNum({
            tenantId: tenantId,
            projectId: projectId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findLevelNum({
            tenantId: tenantId,
            projectId: projectId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findLevelSexNum({
            tenantId: tenantId,
            projectId: projectId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findAllGradeNoTestNum({
            tenantId: tenantId,
            projectId: projectId,
            termId: _this.term,
            half: _this.half,
            yearly: _this.yearly,
          }),
          findNoReleaseFinishTestNum({
            tenantId: tenantId,
            projectId: projectId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          getTenant(tenantId),
          totalTenantPostNumber({ tenantId: tenantId, category: 2 }),
          totalTenantPostNumber({ tenantId: tenantId, category: 4 }),
          getList(1, 1000, { code: "warning_level" }),
        ])
        .then(
          _this.$axios.spread(function (
            res1,
            res2,
            res3,
            res4,
            res5,
            res6,
            res7,
            res8,
            res9,
            res10,
            res11,
            res12,
            res13,
            res14,
            res15,
            res16
          ) {
            _this.schoolDataObj.findALLNum = res1.data.data;
            _this.schoolDataObj.findALLTestNum = res2.data.data;
            _this.schoolDataObj.findAllGradeLevelInterveneNum = res3.data.data;
            _this.schoolDataObj.findFinishNoTestNum = res4.data.data;
            _this.schoolDataObj.findFinishTestNum = res5.data.data;
            _this.schoolDataObj.findGradeLevelInterveneNum = res6.data.data;
            _this.schoolDataObj.findReleaseFinishTestNum = res7.data.data;
            _this.schoolDataObj.findLevelAllNum = res8.data.data;
            _this.schoolDataObj.findLevelNum = res9.data.data;
            _this.schoolDataObj.findLevelSexNum = res10.data.data;
            _this.schoolDataObj.findAllGradeNoTestNum = res11.data.data;
            _this.schoolDataObj.findNoReleaseFinishTestNum = res12.data.data;
            _this.schoolName = res13.data.data.tenantName;
            _this.schoolDataObj.totalTenantPostNumber = {};
            _this.schoolDataObj.totalTenantPostNumber.teacherNum =
              res14.data.data;
            _this.schoolDataObj.totalTenantPostNumber.studentNum =
              res15.data.data;
            _this.schoolDataObj.tenantId = tenantId;
            _this.schoolDataObj.projectId = _this.projectId;

            let levelData = [];
            res16.data.data[0].children.map((vv) => {
              if (vv.dictKey != 0) {
                levelData.push(vv);
              }
            });
            _this.schoolDataObj.levelData = levelData;
            _this.schoolDataObj.LevelType = _this.isLoad = true;
          })
        );
    },
    handleDown(linkParams) {
      linkParams = Object.assign(linkParams, {
        projectId: this.projectId,
        tenantId: this.schoolDataObj.tenantId,
      });
      this.$router.push({
        name: "年级详情列表",
        query: linkParams,
      });
    },
    linkTo() {
      let tenantId = JSON.parse(window.localStorage.getItem("saber-userInfo"))
        .content.tenantId;
      if (this.$route.query.tenantId) {
        tenantId = this.$route.query.tenantId;
      }
      this.$router.push({
        path: "/desk/todo",
        query: {
          projectId: this.projectId,
          tenantId: tenantId,
          todoType: "undone",
          specialTypeId: "1",
        },
      });
    },
    linkDealt() {
      this.$router.push({
        name: "我的待办",
        query: {
          specialTypeId: "1",
        },
      });
    },
    getProjectInfo() {
      let tenantId = JSON.parse(window.localStorage.getItem("saber-userInfo"))
        .content.tenantId;
      if (this.$route.query.tenantId) {
        tenantId = this.$route.query.tenantId;
      }
      getCensusList(1, 1000, { tenantId: tenantId }).then((res) => {
        this.projectOptions = res.data.data.records;
      });
    },
  },
};
</script>
<style lang="scss">
.school {
  background: url("schoolBorad.png") no-repeat;
  width: 100%;
  height: 100%;
  color: #0986b3;
  background-color: #091238;
  background-size: 100%;
  .el-form-item {
    margin-bottom: 0px;
  }
  .el-form-item__label {
    text-align: right;
    vertical-align: middle;
    float: left;
    font-size: 14px;
    color: white;
    line-height: 40px;
    padding: 0 12px 0 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
}
.texAlignLeft {
  text-align: left;
}
.texAlignCenter {
  text-align: center;
}
.texAlignRight {
  text-align: right;
}
.tableTdCss {
  border: 1px solid white;
}
.headerCss {
  background: #29d;
  color: white;
}
.tableRowSingle {
  background: #ebeef5;
}
.tableRowDouble {
  background: #ecf5ff;
}
.schoolTitleCss {
  color: white;
  font-size: 20px;
  text-align: center;
  margin-top: -34px;
}
.borderCss {
  margin: 5px;
  border: 2px solid;
}
.marginInfo {
  margin-left: 10px;
  margin-top: 10px;
}
.topTitleCss {
  border: 1px solid #0984b1;
  padding: 3px 13px 3px 13px;
  color: white;
  font-size: 17px;
  background: #0985b2;
  margin-bottom: 5px;
  display: inline-block;
  border-radius: 5px;
}
</style>
